<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="UTF-8">
	<title>红酒会 - 智能红酒管家</title>
	<link rel="shortcut icon" type="image/x-icon" href="${ctx}/favicon.ico" />
	<link type="text/css" rel="stylesheet" href="${ctx}/static/styles/bootstrap.min.css" />
</head>
<body>
	
	<c:import url="/header"><c:param name="module">talk</c:param></c:import>
	<c:import url="/talk/right" />
	
	<div class="outWrap">
		<div class="spekBoxIn entde">
			<form id="form" class="form-horizontal" action="${ctx}/talk/save" method="post">
				<div class="control-group">
					<label class="control-label" for="title">标题</label>
					<div class="controls">
						<input type="text" id="title" name="title" class="input-xlarge">
						<span id="error_title" class="red"></span>
					</div>
				</div>
				<div class="control-group">
					<label class="control-label" for="content">内容</label>
					<div class="controls">
						<script type="text/plain" id="content" name="content" style="width:80%;"></script>
						<em id="error_content" class="red"></em>
					</div>
				</div>
				<div class="control-group">
					<label class="control-label" for="type">标签</label>
					<div class="controls">
						<c:set var="flag" value="0" />
						<c:forEach var="tag" items="${tagList}">
							<c:if test="${tag.type != flag}"><br/><div style="height:3px"></div></c:if>
							<a href="javascript:void(0)" onclick="changeTags('${tag.id}')">
								<span class="label" id="tag${tag.id}" val="${tag.id}:${tag.name};">${tag.name}</span></a>
							<c:set var="flag" value="${tag.type}" />
						</c:forEach>
						<input type="hidden" id="tagStr" name="tagStr" />
					</div>
				</div>
				<div class="control-group" style="text-align:center">
			    	<div class="controls">
			    		<a href="javascript:void(0)" onclick="history.back();" class="btn">
			    			&nbsp;&nbsp;&nbsp;返&nbsp;&nbsp;&nbsp;回&nbsp;&nbsp;&nbsp;</a>&nbsp;&nbsp;
			      		<button type="submit" class="btn btn-info">&nbsp;&nbsp;&nbsp;提&nbsp;&nbsp;&nbsp;交&nbsp;&nbsp;&nbsp;</button>
			    	</div>
			  	</div>
			</form>
		</div>
	</div>
			
	<c:import url="/WEB-INF/views/footer.jsp" />
	
	<script type="text/javascript" src="${ctx}/static/scripts/jquery.validate.min.js"></script>
	<script type="text/javascript" src="${ctx}/static/libs/ueditor/ueditor.config.js"></script>
	<script type="text/javascript" src="${ctx}/static/libs/ueditor/ueditor.all.js"></script>
	<script type="text/javascript">
		$(function() {
			UE.getEditor('content');
			$('#form').validate({
				rules: {
					title: {
						required: true,
						maxlength: 50
					}
				},
				messages: {
					title: {
						required: '请填写标题',
						maxlength: '标题不能超过50个字符'
					}
				},
				errorElement: 'em',
				errorPlacement: function(error, element) {
					error.appendTo($("#error_" + element.attr("id")));
				},
				submitHandler: function(form) {
					if(UE.getEditor('content').getContent().length < 10) {
						$('#error_content').text('内容好像有点少，多写点吧');
					}else {
						var tags = '';
						$('span.label-info').each(function() {
							tags += $(this).attr('val');
						});
						$('#tagStr').val(tags);
						form.submit();
					}
				}
			});
		});
		function changeTags(tagId) {
			var tag = $('#tag' + tagId);
			if('label' == tag.attr('class')) {
				tag.addClass('label-info');
			}else {
				tag.removeClass('label-info');
			}
		}
	</script>
</body>
</html>